<template>
    <div class="addUser">
        <el-form ref="form" :model="editData" label-width="150px">
            <el-form-item label="商品名字">
                <el-input v-model="editData.goods_name" width="60%"></el-input>
            </el-form-item>
            <el-form-item label="商品类型">
                <el-select v-model="editData.goods_type" placeholder="请选择">
                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="商品库存数量">
                <el-input v-model="editData.goods_num" width="60%"></el-input>
            </el-form-item>
            <el-form-item label="商品成熟季节">
                <el-select v-model="editData.goods_season" placeholder="请选择">
                    <el-option value="春">春</el-option>
                    <el-option value="夏">夏</el-option>
                    <el-option value="秋">秋</el-option>
                    <el-option value="冬">冬</el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="商品园区">
                <el-input v-model="editData.goods_source" width="60%"></el-input>
            </el-form-item>
            <el-form-item label="商品图片">
                <div class="crop-demo">
                    <img :src="editData.goods_image" class="pre-img" />
                    <div class="crop-demo-btn">
                        <input class="crop-input" type="file" name="image" accept="image/*" @change="setImage" />
                    </div>
                </div>
            </el-form-item>
            <el-form-item label="园区采摘价格">
                <el-input v-model="editData.goods_parkPrice" width="60%"></el-input>
            </el-form-item>
            <el-form-item label="线上销售价格">
                <el-input v-model="editData.goods_onLinePrice" width="60%"></el-input>
            </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="onSubmit">确 定</el-button>
        </span>
    </div>
</template>

<script>
import { addCustomer } from '../../../api/index';
export default {
    data() {
        return {
            editData: {},
            options: [
                {
                    value: '葡萄类水果',
                    label: '葡萄类水果'
                },
                {
                    value: '樱桃科水果',
                    label: '樱桃科水果'
                },
                {
                    value: '柑橘类水果',
                    label: '柑橘类水果'
                },
                {
                    value: '苹果类水果',
                    label: '橘子类水果'
                },
                {
                    value: '浆果类水果',
                    label: '浆果类水果'
                },
                {
                    value: '核果类水果',
                    label: '核果类水果'
                },
                {
                    value: '仁果类水果',
                    label: '仁果类水果'
                },
                {
                    value: '瓜类水果',
                    label: '瓜类水果'
                }
            ]
        };
    },
    computed: {
        // editData:function() {
        //     return this.editData
        // }
    },
    watch: {},
    methods: {
        onSubmit() {
            console.log(this.editData.customer_age, 'editData');
            console.log(this.editData, 'thisEditData');
            // const params = `customer_id=${this.thisEditData.customer_id}&customer_type=${this.thisEditData.customer_type}`;
            const params = {
                customer_type: this.editData.customer_type,
                customer_age: this.editData.customer_age,
                customer_name: this.editData.customer_name,
                customer_password: this.editData.customer_password,
                customer_reallyName: this.editData.customer_reallyName,
                customer_sex: this.editData.customer_sex
            };
            addCustomer(params).then((res) => {
                console.log(res);
                if (res) {
                    if (res === 'ok') {
                        this.$message({
                            message: '编辑成功',
                            type: 'success'
                        });
                    } else {
                        this.$message.error('编辑失败');
                    }
                }
            });
        }
    },
    props: []
};
</script>

<style scoped>
.addUser {
    width: 70%;
}
.dialog-footer {
    margin-left: 250px;
}
.crop-demo-btn {
    position: relative;
    width: 100px;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    margin-left: 30px;
    background-color: #409eff;
    color: #fff;
    font-size: 14px;
    border-radius: 4px;
    box-sizing: border-box;
}
</style>